<!DOCTYPE html>
<html>
<header>
	<title></title>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" href="./demo.css" type="text/css">
	<link rel="stylesheet" href="./zTreeStyle.css" type="text/css">
	<script type="text/javascript" src="./jquery-1.4.4.min.js"></script>
	<script type="text/javascript" src="./jquery.ztree.core.js"></script>
	<script type="text/javascript" src="./jquery.ztree.excheck.js"></script>
	<script type="text/javascript" src="./LayersConfig.js"></script>
	<script type="text/javascript" src="./mapOpeaction.js"></script>
	<style>	
		body,html{
            /* overflow-y: auto; */
            overflow-x: hidden;
			/* overflow:hidden; */
			/* background:rgba(255,0,0,0.3); */
			
		}
		ul.ztree{
			margin-top: 0;
			position: absolute;
			top: 0;
			left: 0;
			width: 888px;
			height: 1458px;
			color:red;
		}
	</style>
	<script type="text/javascript">
		var setting = {
			view: {
				selectedMulti: false
			},
			check: {
				enable: true
			},
			data: {
				simpleData: {
					enable: true
				}
			},
			callback: {
				beforeCheck: beforeCheck,
				onCheck: onCheck
			}
		};

		//递归，获取所有的配置文件
		var congigArr = [];
        function digui(arr) {
            for( var i = 0; i< arr.length ; i++){
                if (arr[i].items) {
					congigArr.push(arr[i])
                    digui(arr[i].items)
                } else {
                    congigArr.push(arr[i])
                }
            }
            return congigArr;
		}
		digui(LAYERS_CONFIG);
		var zNodes = congigArr;
		var code, log, className = "dark";
		function beforeCheck(treeId, treeNode) {
			className = (className === "dark" ? "":"dark");
			showLog("[ "+getTime()+" beforeCheck ]&nbsp;&nbsp;&nbsp;&nbsp;" + treeNode.name );
			return (treeNode.doCheck !== false);
		}
		//变化的图层ID数组
		var layersId = [];
		function onCheck(e, treeId, treeNode) {
			// 清空数组，每次复选框都会有数据加进来，所有每次都要清空数组
			window.tmpLayersId = [];
			var layersId = window.addlayers(treeNode);
            console.log(treeNode,layersId,treeNode.id,'000');
           
            
            if(treeNode.checked){
                window.parent._add(layersId);
            }else{
                window.parent._remove(layersId);
            }
			//window.parent.document.getElementById("content").contentWindow.layersShowHide(treeNode.checked,layersId,treeNode.id);
		}		
		function showLog(str) {
			if (!log) log = $("#log");
			log.append("<li class='"+className+"'>"+str+"</li>");
			if(log.children("li").length > 6) {
				log.get(0).removeChild(log.children("li")[0]);
			}
		}
		function getTime() {
			var now= new Date(),
			h=now.getHours(),
			m=now.getMinutes(),
			s=now.getSeconds(),
			ms=now.getMilliseconds();
			return (h+":"+m+":"+s+ " " +ms);
		}

		function checkNode(e) {
			var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
			type = e.data.type,
			nodes = zTree.getSelectedNodes();
			if (type.indexOf("All")<0 && nodes.length == 0) {
				alert("请先选择一个节点");
			}

			if (type == "checkAllTrue") {
				zTree.checkAllNodes(true);
			} else if (type == "checkAllFalse") {
				zTree.checkAllNodes(false);
			} else {
				var callbackFlag = $("#callbackTrigger").attr("checked");
				for (var i=0, l=nodes.length; i<l; i++) {
					if (type == "checkTrue") {
						zTree.checkNode(nodes[i], true, false, callbackFlag);
					} else if (type == "checkFalse") {
						zTree.checkNode(nodes[i], false, false, callbackFlag);
					} else if (type == "toggle") {
						zTree.checkNode(nodes[i], null, false, callbackFlag);
					}else if (type == "checkTruePS") {
						zTree.checkNode(nodes[i], true, true, callbackFlag);
					} else if (type == "checkFalsePS") {
						zTree.checkNode(nodes[i], false, true, callbackFlag);
					} else if (type == "togglePS") {
						zTree.checkNode(nodes[i], null, true, callbackFlag);
					}
				}
			}
		}

		function setAutoTrigger() {
			var zTree = $.fn.zTree.getZTreeObj("treeDemo");
			zTree.setting.check.autoCheckTrigger = true;
			$("#autoCheckTriggerValue").html(zTree.setting.check.autoCheckTrigger ? "true" : "false");
		}

		$(document).ready(function(){
			$.fn.zTree.init($("#treeDemo"), setting, zNodes);
			$("#checkTrue").bind("click", {type:"checkTrue"}, checkNode);
			$("#checkFalse").bind("click", {type:"checkFalse"}, checkNode);
			$("#toggle").bind("click", {type:"toggle"}, checkNode);
			$("#checkTruePS").bind("click", {type:"checkTruePS"}, checkNode);
			$("#checkFalsePS").bind("click", {type:"checkFalsePS"}, checkNode);
			$("#togglePS").bind("click", {type:"togglePS"}, checkNode);
			$("#checkAllTrue").bind("click", {type:"checkAllTrue"}, checkNode);
			$("#checkAllFalse").bind("click", {type:"checkAllFalse"}, checkNode);
			// setAutoTrigger();
		});
	</script>
</header>

<body>
<div class="content_wrap">
	<div class="zTreeDemoBackground left">
		<ul id="treeDemo" class="ztree" ></ul>
	</div>
</div>
</body>
</html>